import 'package:amway_superapp_creator_plugin/config/colors_config.dart';
import 'package:amway_superapp_creator_plugin/models/circle_detail_model.dart';
import 'package:amway_superapp_creator_plugin/routers/application.dart';
import 'package:amway_superapp_creator_plugin/routers/routes.dart';
import 'package:amway_superapp_creator_plugin/utils/time_util.dart';
import 'package:amway_superapp_creator_plugin/viewmodels/circle/my_circle_details_model.dart';
import 'package:amway_superapp_creator_plugin/views/base_view.dart';
import 'package:amway_superapp_creator_plugin/views/circle/video_wiget.dart';
import 'package:amway_superapp_creator_plugin/widget/expandable_text.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:provider/provider.dart';

class MyCircleDetailsVideo extends StatefulWidget {
  String id = "";

  MyCircleDetailsVideo(this.id);

  @override
  _MyCircleDetailsVideoState createState() => _MyCircleDetailsVideoState();
}

class _MyCircleDetailsVideoState extends State<MyCircleDetailsVideo> {
  String url =
      "https://ksv-video-publish.cdn.bcebos.com/8c252963539a41eae18275594606daea786cad31.mp4?auth_key=1649952936-0-0-7c17a0eb67634b4abcd6cd6b5ab71c62";

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return BaseView(
        model: MyCircleDetailsModel(api: Provider.of(context)),
        onModelReady: (model) {
          model.getCircleDetail(widget.id);
        },
        builder: (context, model, child) => Scaffold(
              appBar: AppBar(
                backgroundColor: Colors.white,
                brightness: Brightness.light,
                leading: IconButton(
                  icon: Image.asset(
                    'picture/icon_back.png',
                    package: 'amway_superapp_creator_plugin',
                  ),
                  onPressed: () {
                    Application.router.pop(context);
                  },
                ),
                title: Text(
                  '我的圈子',
                  style: TextStyle(
                      fontSize: ScreenUtil().setSp(18),
                      color: ColorsConfig.c_2c2c2c),
                ),
                centerTitle: true,
              ),
              body: WillPopScope(
                // ignore: missing_return
                onWillPop: () {
                  Application.router.pop(context);
                },
                child: _buildBody(context, model),
              ),
              bottomNavigationBar: _bottomBar(model, context),
            ));
  }

  Widget _bottomBar(MyCircleDetailsModel model, BuildContext context) {
    return model.circleDetail != null &&
            model.circleDetail.publishStatus == "UN_PUBLISH"
        ? Container(
            width: double.infinity,
            color: Colors.white,
            padding: EdgeInsets.fromLTRB(
                ScreenUtil().setWidth(16),
                ScreenUtil().setWidth(16),
                ScreenUtil().setWidth(16),
                ScreenUtil().setWidth(34)),
            child: RaisedButton(
              color: ColorsConfig.c_396E75,
              onPressed: () {
                //未发布
                Map<String, dynamic> parameters = {
                  'isNewAdd': false,
                  'circleData': model.circleDetail,
                  'isUserDraft': false
                };
                Application.router.navigateTo(context, Routes.SENDCIRCLE,
                    routeSettings: RouteSettings(arguments: parameters));
              },
              child: Text("编辑",
                  style: TextStyle(
                      color: Colors.white, fontSize: ScreenUtil().setSp(18))),
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.all(
                Radius.circular(25),
              )),
            ))
        : Container();
  }

  Widget _buildBody(BuildContext context, MyCircleDetailsModel model) {
    if (model.circleDetail == null) {
      return Container();
    }
    return Container(
      child: SingleChildScrollView(
        child: Container(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              _buildVideoView(context, model),
              _buildCircleTitle(context, model),
              _buildCircleContent(context, model),
              _buildTextDate(context, model),
            ],
          ),
        ),
      ),
    );
  }

  Widget _buildVideoView(BuildContext context, MyCircleDetailsModel model) {
    final size = MediaQuery.of(context).size;
    final width = size.width;
    final height = size.height;
    bool _hideActionButton = true;
    return Container(
        width: double.infinity,
        color: Colors.red,
        child: Stack(
          children: [
            VideoWiget(
              videoUrl: url,
            ),
            Positioned(
                child: _verify(model.circleDetail.displayAudits,
                    model.circleDetail.medias[0].data, model))
          ],
        ));
  }

  Widget _buildCircleTitle(BuildContext context, MyCircleDetailsModel model) {
    return Container(
      padding: EdgeInsets.only(
          left: ScreenUtil().setWidth(16),
          right: ScreenUtil().setWidth(16),
          top: ScreenUtil().setHeight(18),
          bottom: ScreenUtil().setHeight(24)),
      child: Stack(
        children: [
          Text(
            model.circleDetail != null && model.circleDetail.title != null
                ? model.circleDetail.title
                : "",
            maxLines: 2,
            overflow: TextOverflow.ellipsis,
            style: TextStyle(
                color: Colors.black, fontSize: ScreenUtil().setSp(22)),
          ),
          Container(
            alignment: Alignment.centerRight,
            child: _verify(
                model.circleDetail.displayAudits,
                model.circleDetail != null && model.circleDetail.title != null
                    ? model.circleDetail.title
                    : "",
                model),
          )
        ],
      ),
    );
  }

  Widget _buildCircleContent(BuildContext context, MyCircleDetailsModel model) {
    return Container(
      padding: EdgeInsets.only(
          left: ScreenUtil().setWidth(16), right: ScreenUtil().setWidth(16)),
      child: Stack(
        alignment: Alignment.bottomRight,
        children: [
          ExpandableText(
            text: model.circleDetail != null &&
                    model.circleDetail.description != null
                ? model.circleDetail.description
                : "",
            maxLines: 6,
            style: TextStyle(
                fontSize: ScreenUtil().setSp(14), color: Colors.black),
            expand: false,
          ),
          Container(
            margin: EdgeInsets.only(bottom: ScreenUtil().setWidth(18)),
            alignment: Alignment.bottomRight,
            child: _verify(
                model.circleDetail.displayAudits,
                model.circleDetail != null &&
                        model.circleDetail.description != null
                    ? model.circleDetail.description
                    : "",
                model),
          )
        ],
      ),
    );
  }

  Widget _buildTextDate(BuildContext context, MyCircleDetailsModel model) {
    return Container(
      padding: EdgeInsets.only(
          left: ScreenUtil().setWidth(16),
          top: ScreenUtil().setHeight(18),
          bottom: ScreenUtil().setHeight(34)),
      child: Text(
        model.circleDetail != null && model.circleDetail.createTime != null
            ? TimeUtil.formatTime(model.circleDetail.createTime)
            : "",
        style: TextStyle(
            fontSize: ScreenUtil().setSp(14), color: ColorsConfig.c_802c2c2c),
      ),
    );
  }

  Widget _verify(List<DisplayAudits> displayAudits, String data,
      MyCircleDetailsModel model) {
    return Container(
        child: states(displayAudits, data, model) == 1
            ? Image.asset(
                "picture/icon_under_review.png",
                package: 'amway_superapp_creator_plugin',
                width: ScreenUtil().setWidth(80),
                height: ScreenUtil().setWidth(30),
              )
            : states(displayAudits, data, model) == 3
                ? Image.asset(
                    "picture/icon_audit_nopass.png",
                    package: 'amway_superapp_creator_plugin',
                    width: ScreenUtil().setWidth(80),
                    height: ScreenUtil().setWidth(30),
                  )
                : Text(""));
  }

  int states(List<DisplayAudits> displayAudits, String data,
      MyCircleDetailsModel model) {
    int s = 0;
    if (displayAudits != null)
      displayAudits.forEach((element) {
        if (data == element.data) {
          if (element.propertyNameTip == "CIRCLE_MEDIAS") {
            s = state(element.status);
            model.circleDetail.medias.forEach((d) {
              if (d.data == element.data) {
                d.imageVerify = s;
              }
            });
            return s;
          }
          if (element.propertyNameTip == "CIRCLE_TITLE") {
            s = state(element.status);
            model.circleDetail.titleVerify = s;
            return s;
          } else if (element.propertyNameTip == "CIRCLE_DESCRIPTION") {
            s = state(element.status);
            model.circleDetail.descriptionVerify = s;
            return s;
          }
        }
      });
    return s;
  }

  int state(String status) {
    switch (status) {
      case "AUDITING": //审核中
        return 1;
        break;
      case "PASSED": //通过
        return 2;
        break;
      case "UN_PASS": //不通过
        return 3;
        break;
      default:
        return 4;
        break;
    }
  }
}
